<template>
<div>
    <el-button type="primary" plain @click="planSelect(item.id)">数据清单
    </el-button>
    <el-dialog width="80%" title="数据清单" :visible.sync="outerVisible">

        <el-card style="margin-bottom: 14px">
            <el-form :inline="true" :model="searchData" class="demo-form-inline messageInput" label-position="left" style="margin-top: 20px">

                <el-form-item label="图斑ID">
                    <el-input v-model="searchData.landCode" maxlength="12" show-word-limit placeholder="请输入"></el-input>
                </el-form-item>
                <el-form-item label="采集状态">
                    <!-- 采集状态 1：未采集 2： 已采集  -->
                    <el-select v-model="searchData.collection">
                        <el-option v-for="(item, index) in collectionList" :key="index" :label="item.label" :value="item.value">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="审核状态">
                    <!-- 审核状态: 0:初始 1:待审核 2:审核成功 3:审核失败 -->
                    <el-select v-model="searchData.review">
                        <el-option v-for="(item, index) in reviewList" :key="index" :label="item.label" :value="item.value">
                        </el-option>
                    </el-select>
                </el-form-item>

                <el-button type="primary" @click="searchLand()">查询</el-button>
                <el-button @click="resetValues()">重置</el-button>
            </el-form>
        </el-card>
        <el-card>
            <div slot="header" class="clearfix">
                <span>图斑数据</span>
                <el-button v-show="userInfo.userLevel<5" size="medium" type="primary" style="float: right" @click="auditMore()">批量审核
                </el-button>
            </div>
            <el-table :data="tableData" border style="width: 100%; margin: 15px 0" @selection-change="handleSelectionChange">
                <el-table-column prop="id" type="selection" width="55"></el-table-column>

                <el-table-column fixed prop="landCode" label="图斑ID" width="100">
                    <template slot-scope="tableData">
                        {{ tableData.row.landId }}
                    </template>
                </el-table-column>

                <el-table-column align="center" prop="planName" width="150" label="所在任务">
                </el-table-column>

                <el-table-column prop="landName" label="地塘块命名" width="150">
                    <template slot-scope="tableData">
                        {{ tableData.row.landName }}
                    </template>
                </el-table-column>
                <el-table-column prop="landTownName" label="镇街" width="100">
                    <template slot-scope="tableData">
                        {{ tableData.row.landTownName }}
                    </template>
                </el-table-column>
                <el-table-column prop="landVillageName" label="村居" width="100">
                    <template slot-scope="tableData">
                        {{ tableData.row.landVillageName }}
                    </template>
                </el-table-column>
                <el-table-column prop="landProductArea" label="面积(亩)" width="100">
                </el-table-column>

                <!-- <el-table-column prop="belongsBody" label="所属主体"> </el-table-column> -->
                <el-table-column align="center" width="80" prop="gather" label="采集状态">
                    <template slot-scope="scope">{{

scope.row.collectStatus == "2" ? "已经采集" : "未采集"

}}
                    </template>
                </el-table-column>
                <el-table-column align="center" width="100" prop="auditStatus" label="审核状态">
                    <template slot-scope="scope">
                        {{ auditStatusCn(scope.row.auditStatus) }}
                    </template>
                </el-table-column>
                <el-table-column align="center" prop="auditPerson" label="审核人" width="150">
                </el-table-column>
                <el-table-column align="center" prop="auditDate" label="审核时间" width="250">
                </el-table-column>

                <el-table-column label="操作" fixed="right" width="100">
                    <template slot-scope="scope">
                        <el-button type="text" v-if="userInfo.userLevel<5 && scope.row.collectStatus !=2" @click="checkAudit(scope.row)">审核{{scope.row.collectStatus}}
                        </el-button>
						 <el-button type="text" :disabled="true" v-else>已审核</el-button>
                    </template>
                </el-table-column>
            </el-table>

            <div class="bottom" style="margin: 15px 0; float: right">
                <el-pagination background @size-change="handleSizeChange" @current-change="currentchange" :current-page="paging.pageNum" :page-sizes="[5, 10, 20, 30, 40]" :page-size="paging.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="paging.total">
                </el-pagination>
            </div>
        </el-card>

        <el-dialog title="图斑地块审核" :visible.sync="dialogStatus" :close-on-click-modal="false" width="40%" :destroy-on-close="true" :append-to-body="true">
            <el-form :model="modelData" status-icon ref="modelData" :inline="false" size="normal" label-width="90px" label-position="right">
                <el-row>
                    <el-col :span="24">
                        <el-card>
                            <el-form-item label="图斑ID" prop="landId">
                                <el-input type="text" :disabled="true" v-model="modelData.landId">
                                </el-input>
                            </el-form-item>

                            <el-form-item label="地块名" prop="landName">
                                <el-input type="text" :disabled="true" v-model="modelData.landName">
                                </el-input>
                            </el-form-item>

                            <el-form-item label="面积(亩)" prop="landProductArea">
                                <el-input type="text" :disabled="true" v-model="modelData.landProductArea">
                                </el-input>
                            </el-form-item>
                            <el-form-item label="镇街" prop="landTownName">
                                <el-input type="text" :disabled="true" v-model="modelData.landTownName">
                                </el-input>
                            </el-form-item>
                            <el-form-item label="村居" prop="landVillageName">
                                <el-input type="text" :disabled="true" v-model="modelData.landVillageName">
                                </el-input>
                            </el-form-item>
                            <el-form-item label="审核状态" prop="auditStatus">
                                <template>
                                    <el-radio v-model="modelData.auditStatus" :label="2">通过
                                    </el-radio>
                                    <el-radio v-model="modelData.auditStatus" :label="3">不通过
                                    </el-radio>
                                </template>
                            </el-form-item>
                            <el-form-item label="审核描述" prop="auditMemo">
                                <el-input type="textarea" v-model="modelData.auditMemo">
                                </el-input>
                            </el-form-item>
                        </el-card>
                    </el-col>
                </el-row>
            </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button type="primary" size="mini" @click="onSubmit()">确 定</el-button>
            </span>
        </el-dialog>
    </el-dialog>
</div>
</template>

<script>
import {
    mapState
} from "vuex";
export default {
    props: {
        item: Object,
    },
    data() {
        return {
            outerVisible: false,
            form: {
                week: "",
            },
            multipleSelection: [],
            tableData: [],
            search: {
                planName: "",
                value: "",
            },
            searchData: {
                pageNumber: 1,
                pageSize: 10,
                landTownCode: "",
                review: ''
            },
            // 采集状态 1：未采集 2： 已采集
            collectionList: [{
                    label: '未采集',
                    value: 1
                },
                {
                    label: '已采集',
                    value: 2
                },
            ],
            // 审核状态: 0:初始 1:待审核 2:审核成功 3:审核失败
            reviewList: [{
                    label: '初始状态',
                    value: 0
                },
                {
                    label: '待审核',
                    value: 1
                },
                {
                    label: '审核成功',
                    value: 2
                },
                {
                    label: '审核失败',
                    value: 3
                }
            ],
            params: {
                pageNumber: 1,
                pageSize: 10,
            },
            paging: {},
            List: [],
            options: [],
            townIndex: 0,
            dialogStatus: false,
            modelData: {
			},
            plans: [],
        };
    },
    computed: {
        ...mapState({
            taskObject: (state) => {
                return state.taskmodel.taskObject;
            },
            currentTask: (state) => {
                return state.currentTask.Task;
            },
            userInfo: (state) => {
                return state.User.userInfo;
            },
        }),
    },
    created() {
        this.selectData();
        // this.planData();

    },
    methods: {
        searchLand() {
            let params = {
                "collectTaskLand.collectStatus": this.searchData.collection,
                "landInfo.landCode": this.searchData.landCode,
                "landInfo.landTownCode": this.searchData.landTownCode,
                "pageNumber": this.paging.pageNum,
                "pageSize": this.paging.pageSize,
                "collectTaskLand.auditStatus": this.searchData.review,
                "collectTaskLand.planId": this.item.id
            }

            this.$axios.get("rbac/data/CollectTaskLand/list", {
                params: params
            }).then((res) => {
                console.log(res)
                this.tableData = res.data.list
                this.paging = res.data
            })

        },
        resetValues() {
            this.searchData.landCode = ''
            this.searchData.review = ''
            this.searchData.collection = ''
        },
        planSelect(val) {
            this.$axios
                .get("rbac/data/CollectTaskLand/list", {
                    params: {
                        "collectTaskLand.planId": val,
                    },
                })
                .then((res) => {
                    console.log(res)
                    this.tableData = res.data.list;
                    this.paging = res.data;
                    this.outerVisible = true;
                });
        },
        auditStatusCn(index) {
            var Status = {
                0: "初始状态",
                1: "待审核",
                2: "审核通过",
                3: "审核失败",
            };

            return Status[index];
        },
        planData() {
            this.$axios
                .get("task/task/queryPlanAccordingToTheTask", {
                    params: {
                        pageNumber: 1,
                        pageSize: 100,
                    },
                })
                .then((res) => {
                    this.plans = res.data.list;
                });
        },
        selectData() {
            var json = JSON.parse(
                window.localStorage.getItem("getTreeData/setAsyncVillageData")
            );
            this.options = json[0].children[0].children;
        },
        statusChange(item) {
            console.log(item);
        },
        onSearch() {},
        handleSizeChange(pageSize) {
            this.params["collectTaskLand.planId"] = this.item.id;
            this.params.pageSize = pageSize;
            this.paging.pageSize = pageSize
            console.log(this.params, 1);
            this.list();
        },
        currentchange(pageNumber) {
            this.params["collectTaskLand.planId"] = this.item.id;
            this.params.pageNumber = pageNumber;
            this.paging.pageNum = pageNumber;
            console.log(this.params, 2);
            this.list();
        },

        list() {
            let params = {
                "collectTaskLand.collectStatus": this.searchData.collection,
                "landInfo.landCode": this.searchData.landCode,
                "landInfo.landTownCode": this.searchData.landTownCode,
                "pageNumber": this.paging.pageNum,
                "pageSize": this.paging.pageSize,
                "collectTaskLand.auditStatus": this.searchData.review,
                "collectTaskLand.planId": this.item.id
            }
            this.$axios
                .get("rbac/data/CollectTaskLand/list", {
                    params: params,
                })
                .then((res) => {
                    this.tableData = res.data.list;
                    this.paging = res.data;
                });
        },
        searchInfo() {
            this.$axios
                .get("rbac/data/LandInfo/getList", {
                    params: {
                        "landInfo.landCode": this.searchData.landCode,
                        "landInfo.landName": this.searchData.landName,
                        "landInfo.landTownCode": this.searchData.landTownCode,
                        "landInfo.landVillageCode": this.searchData.landVillageCode,
                        "landSubject.lsSubjectCode": this.searchData.lsSubjectCode,
                        "landInfo.landProduct": this.searchData.landProduct,
                        subjectName: this.searchData.subjectName,
                        "landInfo.auditStatus": -1,
                    },
                })
                .then((res) => {
                    this.tableData = res.data.list;
                    this.paging = res.data;
                });
        },
        onSubmit() {
            this.dialogStatus = false;
            this.$confirm("是否确认操作?", "提示", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning",
                })
                .then(() => {
                    //发送审核请求
                    this.$axios
                        .post("rbac/LandSubject/auditLand", {
                            params: {
                                landIds: this.modelData.id,
                                auditStatus: this.modelData.auditStatus,
                                auditMemo: this.modelData.auditMemo,
                            },
                        })
                        .then((result) => {
                            //   this.list();
                            this.$message.success("操作完成");
                        });
                })
                .catch(() => {});
        },

        checkAudit(row) {
            console.log(row);
            this.modelData = row;
			this.$set(this.modelData,'auditStatus',2)
            this.dialogStatus = true;
        },

        auditMore() {
            var val = this.selectedData;
            if (val) {
                this.$confirm("是否批量通过审核?", "提示", {
                        confirmButtonText: "确定",
                        cancelButtonText: "取消",
                        type: "warning",
                    })
                    .then(() => {
                        var arr = [];
                        val.forEach(function (item, index) {
                            console.log(item.id);
                            arr.push(item.id);
                        });

                        this.$axios
                            .post("rbac/LandSubject/auditLand", {
                                params: {
                                    landIds: arr.join(","),
                                    auditStatus: 2,
                                },
                            })
                            .then((result) => {
                                console.log(result)
                                this.list();
                                this.$message.success("审核完成");
                            });
                    })
                    .catch(() => {});
            } else {
                this.$alert("请至少选中一条记录", "审核选择", {
                    confirmButtonText: "确定",
                    // callback: (action) => {
                    //   this.$message({
                    //     type: "message",
                    //     message: `action: ${action}`,
                    //   });
                    // },
                });

            }
        },
        openn() {
            this.$alert("这是一段内容", "标题名称", {
                confirmButtonText: "确定",
                callback: (action) => {
                    this.$message({
                        type: "info",
                        message: `action: ${action}`,
                    });
                },
            });
        },
        handleSelectionChange(val) {
            this.selectedData = val;
        },
    },
};
</script>

<style lang="scss">
.checkdata {
    background: #fff;
    padding: 15px;

    .ReviewButton {
        margin: 10px 0;
    }

    .cell {
        display: flex;
        justify-content: space-around;

        .el-button {
            margin: 0 5px;
        }
    }

    .subject {
        display: flex;
    }
}

.sh {
    p {
        line-height: 35px;
    }
}
</style>
